﻿<MDataTable Headers="_headers"
            Items="_desserts"
            ItemsPerPage="5"
            ItemKey="r => r.Name"
            Class="elevation-1"
            FooterProps="@(props => {
                props.ShowFirstLastPage = true;
                props.FirstIcon = "mdi-arrow-collapse-left";
                props.LastIcon = "mdi-arrow-collapse-right";
                props.PrevIcon = "mdi-minus";
                props.NextIcon = "mdi-plus";
            })">
</MDataTable>

@code {

    public class Dessert
    {
        public string Name { get; set; }

        public string Category { get; set; }
    }

    private List<DataTableHeader<Dessert>> _headers = new()
    {
        new()
        {
            Text = "Dessert (100g serving)",
            Align = DataTableHeaderAlign.Start,
            Value = nameof(Dessert.Name)
        },
        new() { Text = "Category", Value = nameof(Dessert.Category) }
    };

    private List<Dessert> _desserts = new List<Dessert>
    {
        new Dessert
        {
            Name = "Frozen Yogurt",
            Category = "Ice cream"
        },
        new Dessert
        {
            Name = "Ice cream sandwich",
            Category = "Ice cream"
        },
        new Dessert
        {
            Name = "Eclair",
            Category = "Cookie"
        },
        new Dessert
        {
            Name = "Cupcake",
            Category = "Pastry"
        },
        new Dessert
        {
            Name = "Gingerbread",
            Category = "Cookie"
        },
        new Dessert
        {
            Name = "Jelly bean",
            Category = "Candy"
        },
        new Dessert
        {
            Name = "Lollipop",
            Category = "Candy"
        },
        new Dessert
        {
            Name = "Honeycomb",
            Category = "Toffee"
        },
        new Dessert
        {
            Name = "Donut",
            Category = "Pastry"
        },
        new Dessert
        {
            Name = "KitKat",
            Category = "Candy"
        }
    };

}
